<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib uri="http://ckeditor.com" prefix="ckeditor"%>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="<c:url value='/resources/styles/main.css' />" type="text/css"/>
    <script type="text/javascript" src="<c:url value='/resources/scripts/datePicker/WdatePicker.js' />"></script>

    <script type="text/javascript">
        function insertRow() {

            var num=0;

            var x=document.getElementById('newbody');

            var tr=document.createElement("tr");

            var td0=document.createElement("td");

            var td1=document.createElement("td");

            var td2=document.createElement("td");

            var seqInput = document.createElement("input");
            seqInput.type = "text";
            seqInput.name = "aseq";
            seqInput.id = "aseq";

            var titleInput = document.createElement("textarea");
//            titleInput.type = "text";
            titleInput.name = "atitle";
            titleInput.id = "atitle";

            var idInput = document.createElement("input");
            idInput.type = "hidden";
            idInput.name = "aid";
            idInput.id = "aid";
//            idInput.value="";


            var btnInput = document.createElement("input");

            btnInput.type = "button";

            btnInput.value = "delete";

            btnInput.onclick = function(){

                deleteRow(btnInput);

            };

            td0.appendChild (seqInput);
            td1.appendChild (titleInput);
            td1.appendChild (idInput);
            td2.appendChild (btnInput);

            tr.appendChild (td0);
            tr.appendChild (td1);
            tr.appendChild (td2);

            x.appendChild (tr);
        }

        function deleteRow(obj) {

            var r = obj.parentNode.parentNode;
            var x=document.getElementById('newbody');
            x.removeChild(r);

        }
    </script>
    <title>问题维护</title>
</head>
<body>

<table class="pagination" style="padding-left: 70px;">
    <tr>
        <td>
            <a href="<c:url value='/admin/survey/listSurvey.do?qid=${qid}' />">返回问题列表</a>
        </td>
    </tr>
</table>
<form  id="addFolder" name="addFolder" action="<c:url value='/admin/survey/editSurvey.do?qid=${qid}' />" method="post">

    <%--序号：<input type="text" id="seq" name="seq" style="margin-top: 3px;margin-left: 3px;" value='${data.seq}'/> </br>--%>
    <%--问卷名称： <select id="questionnaireId" name="questionnaireId">--%>
    <%--<c:forEach var='data1' items="${questions}">--%>
        <%--<option value=${data1.id} ${data1.id==data.questionnaireId? 'selected':''}>${data1.title}</option>--%>
    <%--</c:forEach>--%>
<%--</select>    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--%>
    <%--问题类型: &nbsp;&nbsp;&nbsp;&nbsp;<select id='type' name='type'>--%>
    <%--<option value="single" ${data.type=='single'?'selected':''}>单选</option>--%>
    <%--<option value='multiple' ${data.type=='multiple'?'selected':''}>多选</option>--%>
    <%--<option value='ask' ${data.type=='ask'?'selected':''}>问答</option>--%>
<%--</select>  </br>--%>
    <%--主问题：   <input type="text" id="title" name="title" value='${data.title}' style="margin-top: 3px;margin-left: 3px;"/> </br>--%>
    <%--</br>--%>
    <%--副问题：<input type="text" id="titleOther" name="titleOther" value='${data.titleOther}'  style="margin-top: 3px;margin-left: 3px;"/><span>副问题将会以问答题的形式出现</span> </br>--%>
    <%--&lt;%&ndash;显示日期：<input type="text" id="date" name="date"  class="Wdate" value="${data.day}" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd', readOnly:true})"/>&ndash;%&gt;--%>
    <%--</br>--%>

        <table class="list">

            <tr>
                <td>序号</td>
                <td>
                    <input type="text" id="seq" name="seq" style="margin-top: 3px;margin-left: 3px;" value='${data.seq}'/>
                </td>
            </tr>
            <tr>
                <td>问卷名称</td>
                <td>
                    <select id="questionnaireId" name="questionnaireId">
                        <c:forEach var='data1' items="${questions}">
                        <option value=${data1.id} ${data1.id==data.questionnaireId? 'selected':''}>${data1.title}</option>
                        </c:forEach>
</select>
                </td>
            </tr>
            <tr>
                <td>问题类型</td>
                <td>
                    <select id='type' name='type'>
                        <option value="single" ${data.type=='single'?'selected':''}>单选</option>
                        <option value='multiple' ${data.type=='multiple'?'selected':''}>多选</option>
                        <option value='ask' ${data.type=='ask'?'selected':''}>问答</option>
                        </select>  </br>
                </td>
            </tr>
            <tr>
                <td>主问题</td>
                <td>
                    <input type="text" id="title" name="title" value='${data.title}' style="margin-top: 3px;margin-left: 3px;"/>
                </td>
            </tr>
            <tr>
                <td>副问题</td>
                <td>
                    <input type="text" id="titleOther" name="titleOther" value='${data.titleOther}'  style="margin-top: 3px;margin-left: 3px;"/><span>副问题将会以问答题的形式出现</span>
                </td>
            </tr>
        </table>


    <h4>添加问题备选答案</h4>
    <table class="list" id="tableObj">

        <tr>
            <th scope="col">序号</th>
            <th scope="col">答案</th>
            <th scope="col"><input type="button" value="Add" onclick="insertRow();" /></th>
        </tr>

        <tbody id="newbody">
             <c:if test="${aItemSize>0}">
                 <c:forEach var='answer' items="${data.answerItems}">
                     <tr>
                         <td>
                             <input id="aseq" type="text" name="aseq" value=${answer.seq}>
                         </td>
                         <td>
                             <textarea id="atitle" name="atitle">${answer.title}</textarea>
                             <input type="hidden" id='aid' name='aid' value='${answer.id}'/>
                         </td>
                         <td>
                             <input type="button" value="delete" onclick="deleteRow(this);">
                         </td>
                     </tr>
                 </c:forEach>
             </c:if>

        </tbody>
        <tr>
            <input type='hidden' id='entryDate' name='entryDate' value='${data.entryDate}'/>
            <input type='hidden' id='id' name='id' value='${data.id}'/>
            <td colspan="3"><input type='submit' value="提交"/></td>
        </tr>
    </table>

</form>
</body>
</html>